<template>
  <van-tabs v-model="isActive" @click="changePage">
    <van-tab v-for="(item,index) in tabItemList" :key="index" :title="item.name">
    </van-tab>
  </van-tabs>
</template>

<script>
export default {
  props: ['unreadList', 'isDoctorSessionActive'],
  data () {
    return {
      isActive: 1,
      tabItemList: [
        { name: '新患者', unread: this.unreadList.newNumber || 0, tip: 'new' },
        { name: '对话中', unread: this.unreadList.connectNumber || 0, tip: 'connect' },
        { name: '全部', unread: this.unreadList.allNumber || 0, tip: 'all' }
      ]
    }
  },
  methods: {
    changePage (index) {
      this.$emit('setActiveItem', index + 1)
      sessionStorage.setItem('isDoctorSessionActive', index + 1)
    }
  }
}
</script>
<style scoped lang="stylus">
  .g-header
    // border-bottom: 2px solid #ececec
    .router-link
      font-size: 19px
      // color: red
      .itemName
        position: relative
        .unread
          position: absolute
          top: 10px
          right: 16px
          background: red
          color: #fff
          width: 1rem
          height: 1rem
          line-height: 1rem
          text-align: center
          border-radius: 50%
    .router-active
      background: #fff
      .itemName
        border-bottom: 2px solid #1d7cef
        // border-bottom: 2px solid red
        color: #1d7cef!important
</style>

